GitHub+Hexo for Personal Blog

Posted on | In
  1. Preinstallation
  2. SSH keys
    • check whether ssh exists $cd ~/.ssh. If not, $ssh-keygen -t rsa -C "your_email@example.com" to generate key file
    • get the SSH key $cat ~/.ssh/id_rsa.pub
    • create the key in github: account setting->SSH
    • check the SSH key $ ssh -T git@github.com

  3. create an empty folder as Hexo folder

    1
    2
    3
    $hexo init
    $hexo generate
    $hexo server

    local test: http://localhost:4000/

  4. deploy local Hexo folder

    • in Hexo folder, modify the _config.yml file as follows, 

      1
      2
      3
      4
      deploy:
      	type: git
      	repository: $(SSH address from github)
      	branch: master

    • in Hexo folder, install the deployer by $npm install hexo-deployer-git --save

    • type $hexo g and $hexo d, or $hexo d -g.
  5. change theme: go to the folder “/themes” and git clone https://github.com/iissnan/hexo-theme-next. config the theme in the file “/themes/XXXX/_config.yml”.

  6. local search

    • $npm install hexo-generator-searchdb --save

    • in the site _config.yml file, set local_search: enable: true. paste the following lines anywhere.

      1
      2
      3
      4
      5
      search:
      	path: search.xml
      	field: post #post, page, all
      	format: html
      	limit: 10000

  7. add new page for some subcategory (e.g., write): in the theme _config.yml file

    1
    2
    menu:
       write: /categories/write

  8. add social links: in the theme _config.yml file

    1
    2
    3
    4
    # Social links
    social:
    	GitHub: https://github.com/ustcnewly
    	Linkedin: https://www.linkedin.com/in/li-niu-b0905133/

  9. latex:

    • install $npm install hexo-math --save and restart Hexo

    • in the theme _config.yml file, modify as follows (notice that cdn may change) 

      1
      2
      3
      4
      5
      # MathJax Support
      mathjax:
      	enable: true
      	per_page: false
      	cdn: //cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML

    • to address the conflict between MathJax and Hexo

      1
      2
      $npm uninstall hexo-renderer-marked --save
      $npm install hexo-renderer-kramed --save

  10. push posts to the top

    • $ npm install hexo-generator-index-pin-top --save.
    • for the target post, add top: true in Front-matter, or top: 10 with larger number indicating higher priority.

  11. insert code block

    1
    2
    3
    {% codeblock lang:python %}
    code snippet
    {% endcodeblock %}

  12. insert image

    1
    <img src="http://bcmi.sjtu.edu.cn/~niuli/github_images/t0IXoZq.jpg" width="50%" height="50%">

Tips:

  1. If something is wrong with the representation and hard to tune, you can try deleting extra spaces or adopting an alternative format (e.g., two code block formats).

  2. Case sensitive: sometimes you switch between capital letter and small letter, which may lead to 404 not found errors.

    • set ignorecase as false in the file .deploy_git/.git/config
    • clean the folder .deploy_git
    • hexo clean and hexo d -g